import { UIManager } from "../manager/UIManager";
import RankConfig from "./RankConfig";

const { ccclass, property } = cc._decorator;

export interface IRankData {
    id: number;         // 排名
    district: string;   // 省名(汉字)
    name: string;       // 省名(拼音)
    people: number;     // 上榜人数
}

@ccclass
export default class RankUI extends cc.Component {
    public static instance: RankUI = null;

    @property({ type: cc.Node, tooltip: "items" })
    private items: cc.Node = null;
    @property({ type: cc.Node, tooltip: "item" })
    private item: cc.Node = null;

    @property({ type: cc.Node, tooltip: "我的排行" })
    private myRank: cc.Node = null;

    protected async onLoad() {
        RankUI.instance = this;

        this.initData();
    }

    private initData() {
        RankConfig.rankList.forEach((o) => {
            const item = cc.instantiate(this.item);
            item.active = true;
            item.parent = this.items;
            const rank = cc.find("rank", item);
            const node = cc.find("node", item);
            const labRank = cc.find("labRank", rank).getComponent(cc.Label);
            const name = cc.find("labName", item).getComponent(cc.Label);
            const value = cc.find("labValue", item).getComponent(cc.Label);
            rank.active = o.id > 3;
            node.active = o.id < 4;
            labRank.string = `${o.id}`;
            name.string = `${o.district}`;
            value.string = `${o.people}`;
            node.children.forEach((child, index) => {
                child.active = o.id == index + 1;
            });
        });

        const temp = RankConfig.rankList[0];
        const labRank = cc.find("rank/labRank", this.myRank).getComponent(cc.Label);
        const labName = cc.find("labName", this.myRank).getComponent(cc.Label);
        const labValue = cc.find("labValue", this.myRank).getComponent(cc.Label);
        labRank.string = `${temp.id}`;
        labName.string = `${temp.district}`;
        labValue.string = `${temp.people}`;
    }

    private onBtnsClicked(event: cc.Event, data: cc.Event.EventCustom) {
        const name = event.target.name;
        switch (name) {
            case "btnClose":
                {
                    UIManager.ins.close();
                }
                break;
        }
        // console.log("onReviveClicked()===>按钮:", name);
    }
}